<template>
    <div>
      <el-card>
        <el-page-header content="未缴费业主列表" icon="" title="崔缴管理" >
            <el-button type="success" @click="postEmail" style="margin-top:30px">一键催缴</el-button>
        </el-page-header>

        <el-table :data="tableData" style="width: 100%">
          <el-table-column prop="propname" label="名字" width="180" />
          <el-table-column prop="propnumber" label="电话" width="180" />
          <el-table-column prop="propemail" label="邮箱" width="180" />
          <el-table-column prop="building" label="楼号" />
          <el-table-column prop="roomnumber" label="房号" />
          <el-table-column prop="tmoney" label="总金额" />
          <!-- <el-table-column prop="editTime" label="收费时间" width="180" /> -->
          <el-table-column label="收费时间" width="180">
            <template #default="scope">
              {{ formatTime.gettime(scope.row.editTime) }}
            </template>
          </el-table-column>
          <!-- <el-table-column prop="ispay" label="是否缴费" width="180" /> -->
  
          <el-table-column label="是否缴费">
            <template #default="scope">
              <el-tag v-if="scope.row.ispay === 0" class="ml-2" type="danger">未缴费</el-tag>
              <el-tag v-else class="ml-2" type="success">以缴费</el-tag>
            </template>
          </el-table-column>
  
          
        </el-table>
      </el-card>
  
    </div>
  </template>
  
  <script setup>
  import { ref, onMounted, reactive } from "vue";
  import axios from "axios";
  import formatTime from "@/util/formatTime.js";
  
  const dialogVisible = ref(false);
  const tableData = ref([]);

  const rateFormRef = ref();
  const contentData = ref([]);
  const contentDataForm = reactive({
    propname:"",
    propemail:"",
    tmoney:"",
  })
  onMounted(() => {
    getTableData();
  });
  
  const getTableData = async () => {
    const res = await axios.get("/adminapi/rate/list2");
    // console.log(res.data)
    tableData.value = res.data.data;
    
  };

  const rateForm = reactive({
    propname: "",
    propnumber: null,
    propemail: "",
    building: 1,
    roomnumber: 101,
    basics: null,
    extend: null,
    tmoney: null,
    ispay: 0,
  });
  

  //拿到当前节点数据显示在界面
  const handleEdit = async (data) => {
    const a = data._id;
    //console.log(a);
    const res = await axios.get(`/adminapi/rate/list/${a}`);
    //console.log(res.data.data);
    Object.assign(rateForm, res.data.data[0]);
    dialogVisible.value = true;
  };

  const readyEmail = async (data) => {  //请求接口 发送催缴邮件
    const res2 = await axios.post("/adminapi/rate/email",data);
    console.log(res2)
  }

  const postEmail = async () => {
    const res = await axios.get("/adminapi/rate/list2"); //取数据 拿到名字 邮箱 和总金额
    contentData.value = res.data.data;
    for(let i=0;i<contentData.value.length;i++){
        contentDataForm.propname=contentData.value[i].propname
        contentDataForm.propemail=contentData.value[i].propemail
        contentDataForm.tmoney=contentData.value[i].tmoney
        readyEmail(contentDataForm)
    }
  }
  
  </script>
  
  <style lang="scss" scoped>
  .el-table {
    margin-top: 50px;
  }
  </style>
  